<template>
  <div :class="[SchoolContain]">
    <h2>学校名称:{{name}}</h2>
    <h2>学校地址:{{address}}</h2>
    <button @click="showName">提示学校名称</button>
  </div>
</template>

<script>
	// 可以省略 Vue.extend(),直接用对象作为暴露的对象
	export default {
		name: 'SchoolItem', // 与文件名相同 
		data(){
			return {
				name:'hefei',
				address: 'hefei',
				SchoolContain:'SchoolContain'
			}
		},
		methods:{
			showName(){
				alert(this.name)
			}
		}
	}
	
	// 暴露出默认方法
	//分别暴露 export const school = xxxx  -》 引入方法 import {school} from 'school'
	//统一暴露 export {school}  -》 引入方法  import {school} from 'school'
	//默认暴露 export default   -》 引入方法  import school from 'school'
</script>

<style>
	.SchoolContain {
		background-color: orange;
	}
</style>
